<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,height=device-height">
    <link rel="stylesheet" href="<?php echo base_url().'public/home/' ?>css/general.css">
    <script src="<?php echo base_url().'public/home/' ?>js/jquery-2.0.3.min.js"></script>
        <script src='<?php echo base_url().'public/home/mobile_date/' ?>jdate.min.js'></script>
      <script type="text/javascript" src="<?php echo base_url().'public/home/js/' ?>function.js"></script>
        <script type="text/javascript" src="<?php echo base_url().'public/home/alert/js/' ?>alert.js"></script>
    <title>其他材料统计报表</title>
</head>
<style>

    .min {
        height: auto;
        margin: 5%;
        overflow: auto;
    }

    .fk {
        width: 100%;
        height: auto;
        border-radius: 4px;
        background-color: #fff;
        margin-bottom: 5%;
    }
    .name{
        margin-left: 4%;
        padding-top: 5%;
        margin-bottom: 5%;
    }
    .fk p{
        display: inline;
    }
    #ddname{
        margin-left: 1%;
        font-size:18px
    }
    .sz{
    font-size:18px;
    color: #2e2e2e;
    }
    #section{
        float:right;
        line-height:24px;
        margin-right: 5%;
        color:#616161;
        font-size: 18px;
    }
    .fgx{
        border-top: 1px solid #d4d4d4;
        border-bottom: 0;
        border-left: 0;
        border-right: 0;
    }
    .xdd{
        width:90%;
        padding: 10px;
    }
    .xddo{
        color: #2e2e2e;
        width:38%;
        font-size:18px;
    }
    .spans{
        /* margin-right: 21%; */
        float:right;
        font-size:18px;
        color:#2e2e2e;
    }
    .spans1{
        /* margin-right: 22%; */
        font-size:18px;
        float:right;
        color:#2e2e2e;
    }
    .spans2{
        /* margin-right: 9%; */
        font-size:18px;
    }
    .tds{
        height: 15px;
    }
    .bot{
        position:fixed;
        bottom:0;
        background-color:#fff;
        width:100%;
        height: 103px;
        line-height:50px;
    }
    .bot table{
        width:100%;
        text-align:center;
       
    }

    .bot table tr td{
        border:1px solid #000;
        
    }

    .filter-item input{
    width: 75%;
    float: left;
    border: none;
    margin-top: 4px;
    color: #797979;
    overflow:hidden;
      text-overflow: ellipsis;
      white-space:nowrap;
      text-align: center;
      margin-right: 5px;
    }
    .filter-item img{
        width: 13px;
        float: left;
        margin: 8px 0 0 0;
    }
    .filter{
        display: flex;
        justify-content: space-around;
        align-items: center;
        height: 50px;
        background: #fff;
    }
    .filter div{
        float: left;
    }
    a{
        text-decoration:none;
        color:#3577F7;
    }

</style>

<body>
    <input type="hidden" name="url" id="url"value="<?php echo base_url() ?>">
    <input type="hidden" name="admin_id" id="admin_id"value="<?php echo $_SESSION[SESS_USER_HOME]['id'] ?>">
  <div class='filter'>
        <div class="filter-item">
            <input type="text" id="date" onchange="getList(true)" value="" placeholder="开始日期"><img src="<?php echo base_url().'public/home/' ?>images/drop_down.png" alt="">
        </div>
        <div class="filter-item">
            <input type="text" id="date1" onchange="getList(true)" value="" placeholder="结束日期"><img src="<?php echo base_url().'public/home/' ?>images/drop_down.png" alt="">
        </div>
    </div>
    <div class="min">
        
         
    </div>
        
    </div>
    
    <div class="loading" style="text-align:center;"><img src="<?php echo base_url().'public/home/' ?>images/loading1.gif"></div>
    <div class="tip" style="display: none; text-align:center;font-size:13px;color: #5d5d5d;line-height:80px;}">到底了,没有数据了~</div>

    <div style="height:120px"></div>
    

    <div class="botn"> 
    
      
    </div>


<script>

    let admin_id = $('#admin_id').val();
    let pageNo=1;
    let pageSize=20
    let have=true;
       
    // var one =0;
    // var x=0;
    // var c=0;
    // var s=0;
    // var a=0;
    // var n=0;
    $(function () {
          new Jdate({
              el: '#date',
              format: 'YYYY-MM-DD',
              beginYear: 2019,
              endYear:  new Date().getFullYear(),              
                confirm: function(date) {
                    $("#date").val(date)
                    have=true;
                    getList(true)
                },
            })
        new Jdate({
              el: '#date1',
              format: 'YYYY-MM-DD',
              beginYear: 2019,
              endYear:  new Date().getFullYear(),              
                confirm: function(date) {
                    $("#date1").val(date)
                    have=true;
                    getList(true)
                },
            })

        // console.log(pageNo);
        // console.log(pageSize);
        getList(); 
        $(window).scroll(function(){
            // scroll at bottom
            if ($(window).scrollTop() + $(window).height() == $(document).height()) {
                pageNo++;
                getList();
            }
        });

        
    })
    function getList(change=false){
        // console.log(pageNo);
        if(have){
            if(change){
                if($("#date").val()!='' && $("#date1").val()!=''){
                  var  date = $("#date").val()+','+$("#date1").val();
                }else if($("#date").val() =='' && $("#date1").val()!=''){
                      errorAlert('请选择开始日期');
                } else if($("#date").val() !='' && $("#date1").val()==''){
                      errorAlert('请选择结束日期');
                }
               $(".min").html('')  ;   
            }else{
                if($("#date").val()!='' && $("#date1").val()!=''){
                  var  date = $("#date").val()+','+$("#date1").val();
                }else{
                    var date = '';
                }      
            }  
            $.ajax({
                url: $("#url").val()+"/Home/Attend/otherStatistics",
                dataType:"json",
                type: "post",
                data: {
                    pageNo:pageNo,
                    pageSize:pageSize,
                    admin_id:$("#admin_id").val(),
                    created:date,
                },
                success: function (data) {
                    let t = JSON.parse(data.v);
                    // console.log(t);
                    let html = ''; 


                    if(status = true){
                                        
                        //判断是否有数据
                        if(t.count==0){
                            $(".loading").hide();
                            $(".tip").show();
                        }

                        // console.log(t.ret);
                        $.each(t.ret, function (k, v) { 
                            let a = (pageNo-1) * pageSize + (k+1) + '.' ;

                            html += `<div class="fk">
                                <div class="name">
                                    <p id="sz" class="sz">${a}</p><p id="ddname">${v.username}</p><p id="section">${v.dept_name}</p>
                                </div>
                                <div class="fgx"></div>
                                <div class="xdd">
                                    <span class="xddo">专题调研次数：<p id="frequencyo" class="specialResearch">${v.specialResearch}</p></span><span class="spans">巡(检)查次数：<p id="frequencyt" class="patrol">${v.patrol}</p></span>
                                </div>
                                <div class="fgx"></div>
                                <div class="xdd">
                                <span class="xddo">巡考次数：<p id="frequencyth" class="tourInformant">${v.tourInformant}</p></span><span class="spans1">专项检查次数：<p id="frequencyf" class="specialInspection">${v.specialInspection}</p></span>
                                </div>
                                <div class="fgx"></div>
                                <div class="xdd">
                                <span class="xddo">顶岗实习检查次数：<p id="frequencyfi" class="postPractice">${v.postPractice}</p></span></span>
                                </div>
                                <div class="fgx"></div>
                                <div class="xdd">
                               <span class="xddo">信息员专题调查次数：<p id="frequencys" class="messenger">${v.messenger}</p></span>
                                </div>
                            </div>`
                            
                            
                            // 判断是否还有数据
                            if( pageNo==t.totalPage){
                                have=false
                                $(".loading").hide();
                                $(".tip").show();
                            }


                            // $('.min').append(html);
                        });

                        // console.log(html);
                
                    $('.min').append(html);
                     getTotal();
                        // one += t.all_count.specialResearch;
                        //       x += t.all_count.patrol;
                        //       c += t.all_count.tourInformant;
                        //       s += t.all_count.specialInspection;
                        //       a += t.all_count.postPractice;
                        //       n += t.all_count.messenger;

           /*                   var itme = `<div class="bot">
                        <form>
                            <table cellpadding=0 cellspacing=0>
                                 <tr>
                                       <td rowspan="2" style="border-right:0;">合计</td>
                                       <td style="border-right:0;">专题</td>
                                       <td style="border-right:0;">巡（检）查</td>
                                       <td style="border-right:0;">巡考</td>
                                       <td style="border-right:0;">专项</td>
                                       <td style="border-right:0;">顶岗实习</td>
                                       <td>信息员</td>
                                 </tr>
                                 <tr>
                                    <td style="border-right:0;border-top: 1px;" id="specialResearch">${one}</td>
                                    <td style="border-right:0;border-top: 1px;" id="patrol">${x}</td>
                                    <td style="border-right:0;border-top: 1px;" id="tourInformant">${c}</td>
                                    <td style="border-right:0;border-top: 1px;" id="specialInspection">${s}</td>
                                    <td style="border-right:0;border-top: 1px;" id="postPractice">${a}</td>
                                    <td style="border-top: 1px;" id="messenger">${n}</td>
                                </tr>
                            </table>
                        </form>
                             </div>`

                             $('.botn').append(itme);*/


                    }else if(status = false){
                      
                      $(".loading").hide();
                      $(".tip").show();
                      } 

                    
                    

                },
            });
        }
    }


    function getTotal(){
           //数组累加
           var fk = $(".fk").length;
           // console.log(fk);
            var one =0; var x=0;  var c=0; var s=0; var a=0; var n=0;
           for(var i=0;i<fk;i++){
            console.log($(".specialResearch").eq(i).text());
             one += parseInt($(".specialResearch").eq(i).text());
             x += parseInt($(".patrol").eq(i).text());
             c += parseInt($(".tourInformant").eq(i).text());
             s += parseInt($(".specialInspection").eq(i).text());
             a += parseInt($(".postPractice").eq(i).text());
             n += parseInt($(".messenger").eq(i).text());

           } 

            var itme = `<div class="bot">
                        <form>
                            <table cellpadding=0 cellspacing=0>
                                 <tr>
                                       <td rowspan="2" style="border-right:0;">合计</td>
                                       <td style="border-right:0;">专题</td>
                                       <td style="border-right:0;">巡（检）查</td>
                                       <td style="border-right:0;">巡考</td>
                                       <td style="border-right:0;">专项</td>
                                       <td style="border-right:0;">顶岗实习</td>
                                       <td>信息员</td>
                                 </tr>
                                 <tr>
                                    <td style="border-right:0;border-top: 1px;" id="specialResearch">${one}</td>
                                    <td style="border-right:0;border-top: 1px;" id="patrol">${x}</td>
                                    <td style="border-right:0;border-top: 1px;" id="tourInformant">${c}</td>
                                    <td style="border-right:0;border-top: 1px;" id="specialInspection">${s}</td>
                                    <td style="border-right:0;border-top: 1px;" id="postPractice">${a}</td>
                                    <td style="border-top: 1px;" id="messenger">${n}</td>
                                </tr>
                            </table>
                        </form>
                             </div>`    
        $('.botn').append(itme);
           // console.log(one);
    }


    
</script>

    
</body>

</html>